<template>
	<view class="wrap">
		<u-time-line>
			<u-time-line-item v-for="(item, index) in upHistory" :key="index">
				<template v-slot:content>
					<view>
						<view class="version">
							<text>v{{ item.version }}</text>
						</view>
						<view class="updateDate"><u-tag :text="item.add_time | timeFormat('yy-mm-dd')" type="error" size="mini" /></view>
						<view class="list">
							<view class="detail" v-for="(sitem, sindex) in item.data" :key="sindex">
								<text class="circle"></text>
								<u-tag :text="setType(sitem.type, 'title')" :type="setType(sitem.type, 'color')" size="mini" />
								<text>{{ sitem.desc }}</text>
							</view>
						</view>
					</view>
				</template>
			</u-time-line-item>
		</u-time-line>
	</view>
</template>

<script>
export default {
	data() {
		return {
			upHistory: []
		}
	},
	onLoad() {
		this.getUphistory()
	},
	methods: {
		getUphistory() {
			this.$u.api.updateHistory().then(res => {
				console.log(res)
				this.upHistory = res.data
			})					
			return
			uniCloud.callFunction({
				name: 'upHistory',
				success: res => {
					// console.log(res)
					this.upHistory = res.result.data
				}
			})
		},
		setType(type, set) {
			if (set == 'title') {
				if (type == 0) {
					return '新增'
				} else if (type == 1) {
					return '优化'
				} else if (type == 2) {
					return '修复'
				}
			} else if (set == 'color') {
				if (type == 0) {
					return 'success'
				} else if (type == 1) {
					return 'primary'
				} else if (type == 2) {
					return 'warning'
				}
			}
		}
	}
}
</script>

<style lang="scss">
.wrap {
	padding: 24rpx 24rpx 24rpx 40rpx;
}

.version {
	font-weight: bold;
	color: #444;
}
.updateDate {
	margin: 20rpx 0 10rpx;
}
.list {
	.detail {
		margin-bottom: 10rpx;
		.circle {
			display: inline-block;
			width: 4px;
			height: 4px;
			border-radius: 4px;
			border: 2rpx solid #999;
		}
		u-tag {
			margin: 0 10rpx;
		}
		text {
			font-size: 24rpx;
			color: #444;
		}
	}
}
.u-dot {
	height: 20rpx !important;
	width: 20rpx !important;
	border-radius: 100rpx !important;
	background: none !important;
	border: 1rpx solid #2d8cf0 !important;
}
</style>
